<!DOCTYPE html>
<html>
<head>
	<title>Onyx Settings</title>
	<!-- -->
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
	<!-- -->
	<script src="../../../../enyo/enyo.js" type="text/javascript"></script>
	<script src="../../../onyx/package.js" type="text/javascript"></script>
	<script src="../../../layout/fittable/package.js" type="text/javascript"></script>
	<!-- -->
	<script src="App.js" type="text/javascript"></script>
	<!-- -->
	<style>
		.align-center {
			text-align: center;
		}
		.main {
			max-width: 600px;
			margin: 0 auto;
		}
		.main > * {
			padding: 20px;
		}
		.groupbox-item {
			padding: 10px;
			min-height: 30px;
			line-height: 30px;
		}
		.groupbox-item > * {
			display: inline-block;
		}
		/* right-align the last control inside item */
		.groupbox-item > :last-child {
			float: right;
		}
		/* IE8 */
		.groupbox-item > :first-child + div {
			float: right;
		}
		.groupbox-item > :only-child {
			display: block;
			float: none;
		}
	</style>
</head>
<body>
<script type="text/javascript">
	new App({fit: true, classes: "onyx enyo-unselectable"}).write();
</script>
</body>
</html>
